<%--用户订单--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<div class="col-md-9">
    <div class="data_list">
        <div class="data_list_title"><span class="iconfont icon-dingdanzhuangtai "></span>&nbsp;数据报表</div>
        <div class="container-fluid">
            <div class="row" style="padding-top: 20px;">
                <div class="orderbox">
                    <div class="orderinfobox">
                        <div class="headbox">
                            <div class="headinfobox" style="height: 78px;padding-bottom: 10px">
                                <a href="" class="headimg-a"><img src="../statics/images/user/${user.userImg}"></a>
                                <div class="username"><a>${user.userName}</a>
                                </div>
                                <ul class="orderother">
                                    <li><a href="${userId}">我的默认送餐信息</a></li>
                                    <li><a href="${userId}">我的优惠信息</a></li>
                                    <li><a href="${userId}">我的账户</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="contentbox">
                            <ul>
                                <li><a>待付款</a></li>
                                <li><a>待接单</a></li>
                                <li><a>派送中</a></li>
                                <li><a>待评价</a></li>
                                <li><a>评价</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="ordercontentbox">
                        <c:if test="${empty orderList}">
                            <div class="contenttitlebox"><span class="iconfont icon-tishi"></span> 暂未找到您的订单信息</div>
                        </c:if>
                        <c:forEach items="${orderList}" var="order">
                            <div class="contenttitlebox">
                                <span
                                        <c:if test="${order.orderStatue=='待评论'}">class=" iconfont icon-pingjia"</c:if>
                                        <c:if test="${order.orderStatue=='待接单'}">class="iconfont icon-yuyuedingdan "</c:if>
                                        <c:if test="${order.orderStatue=='待送餐'}">class="iconfont icon-dingdanzhuangtaidengdai"</c:if>
                                        <c:if test="${order.orderStatue=='送餐中'}">class="iconfont icon-wancheng"</c:if>>
                                      </span>${order.orderStatue}
                            </div>
                                <div class="contentmainbox"><ul>
<%--           icon-dingdanzhuangtaichenggong
订单状态-等待
.icon-dingd   一不小心把前面的order丢了--%>
                                    <c:forEach items="${order.foodList}" var="food">
                                        <li>${food.foodName}<c:if test="${!empty food.orderNum}">,订单号:${food.orderNum}</c:if><c:if test="${!empty food.orderName}">；派送人${food.orderName}</c:if><c:if test="${!empty food.orderPhone}">；电话${food.orderPhone}</c:if><c:if test="${!empty food.foodId}"><a href="${food.foodId}">评价</a></c:if></li>
                                    </c:forEach>
                                </ul></div>
                        </c:forEach>
                    </div>
                </div>
                <style>
                    .orderbox {
                        width: 100%;
                        padding-left: 10px;
                        padding-right: 10px;
                        font-family: tahoma, arial, 'Hiragino Sans GB', 'Microsoft YaHei', 宋体, sans-serif;
                        line-height: 23px;
                    }

                    .headimg-a {
                        float: left;
                        display: block;
                        width: 52px;
                        height: 52px;
                        margin-right: 13px;
                        margin-left: 12px;
                        position: relative;
                        border: 2px solid #FFF;
                        border-radius: 50%;
                        overflow: hidden;
                        color: #000;
                        outline: 0;
                        cursor: pointer;
                        text-decoration: none;
                    }

                    .headimg-a img {
                        border-radius: 50%;
                        width: 100%;
                        height: 100%;
                        border: 0;
                    }

                    .headbox {
                        padding: 5px 0;
                        padding-top: 10px;
                        position: relative;
                        font: 12px tahoma, arial, 'Hiragino Sans GB', '\5b8b\4f53', sans-serif;
                        font-family: tahoma, arial, 'Hiragino Sans GB', 'Microsoft YaHei', 宋体, sans-serif;
                        color: #546d7e;
                        background: #f5f8fa;
                        border-bottom: 1px solid #e4eaee;
                        line-height: 23px;
                    }

                    .username {
                        margin-top: 6px;
                        display: block;
                        color: #000;
                    }

                    .username a {
                        cursor: pointer;
                    }

                    .username a:hover {
                        color: #f40;
                        outline: 0;
                        text-decoration: none;
                    }

                    .contentbox {
                        background: #fff;
                        font-size: 12px;
                        color: #4b4b4b;
                    }

                    .contentbox ul {
                        display: flex;
                        padding-left: 0;
                        list-style: none;
                        height: 52px;
                        overflow: hidden;
                    }

                    .contentbox li {
                        margin: 0;
                        padding: 0;
                        width: 20%;
                        border: 1px solid #eef1f4;
                    }

                    .contentbox li a {
                        padding: 17px 0;
                        display: block;
                        color: #4b4b4b;
                        text-align: center;
                        outline: 0;
                        cursor: pointer;
                        text-decoration: none;
                    }

                    .orderother {
                        display: flex;
                        position: relative;
                        padding-left: 0;
                        list-style: none;
                        right: 0;
                    }
                    .orderother li{
                        width: 33%;
                    }
                </style>
                <style>
                    .ordercontentbox{
                        border: 0;
                        position: relative;
                        z-index: 2;
                        margin-bottom: 23px;
                        color: #4b4b4b;
                        font: 12px tahoma, arial, 'Hiragino Sans GB', '\5b8b\4f53', sans-serif;
                    }
                    .contenttitlebox{
                        height: 45px;
                        line-height: 45px;
                        padding-left: 22px;
                        background-color: #f5f8fa;
                    }
                    .contenttitlebox span{
                        display: inline-block;
                        width: 27px;
                        height: 24px;
                        text-align: right;
                        margin-right: 5px;
                        line-height: 14px;
                    }
                    .contentmainbox{
                        position: relative;
                        border: 1px solid #e4eaee;
                        border-top-color: rgb(228, 234, 238);;
                        padding-left: 0;
                        overflow: hidden;
                        background: #fff;
                    }
                    .contentmainbox ul{
                        list-style: none;
                        margin: 10px;
                        padding: 0;
                    }
                    .contentmainbox ul li{
                        padding: 5px;
                        border: 1px solid #eef1f4;
                        border-radius: 3px;
                    }
                </style>
            </div>
        </div>
    </div>
</div>